From 67f245a48faf6e89989aca2ea571b657fd4c8888 Mon Sep 17 00:00:00 2001
From: Valentin Popov <valentin@popov.link>
Date: Wed, 11 Jun 2025 23:20:36 +0000
Subject: feat: integrate schema.org support and enhance component structure

- Added schema.org support by introducing `schema-dts` for structured data in components.
- Updated `Head`, `BaseLayout`, and various page components to accept and utilize schema props for better SEO.
- Created new utility schemas for blog posts and website to standardize structured data implementation.
- Enhanced the `SocialLinks` section by utilizing dedicated icon components for improved maintainability.
- Refactored the `Header` component to improve accessibility and structure.
- Introduced new icons for social links and integrated them into the layout.
---
 src/pages/blog/[...slug].astro | 24 ++++++++++++++++++------
 1 file changed, 18 insertions(+), 6 deletions(-)

(limited to 'src/pages/blog/[...slug].astro')

diff --git a/src/pages/blog/[...slug].astro b/src/pages/blog/[...slug].astro
index c625057..8d5169a 100644
--- a/src/pages/blog/[...slug].astro
+++ b/src/pages/blog/[...slug].astro
@@ -2,6 +2,7 @@
 import { type CollectionEntry, getCollection } from "astro:content";
 import Comments from "../../components/Comments.astro";
 import Layout from "../../layouts/BaseLayout.astro";
+import blogPostSchema from "../../utils/schemas/blogPostSchema";
 import dayjs from "dayjs";
 
 type Props = CollectionEntry<"blog">;
@@ -21,10 +22,21 @@ const post = Astro.props;
 
 const { Content, remarkPluginFrontmatter } = await post.render();
 
-const date = dayjs(post.data.pubDate.toString()).format("MMMM DD, YYYY");
-const title = `${post.data.title} | Valentin Popov`;
+const title = post.data.title;
 const description = post.data.description;
+const author = post.data.author;
 const lang = post.data.lang;
+
+const formattedData = dayjs(post.data.pubDate.toString()).format("MMMM DD, YYYY");
+const data = post.data.pubDate.toISOString();
+
+const schema = blogPostSchema({
+	siteUrl: new URL("/", Astro.site).toString(),
+	title,
+	slug: post.slug,
+	datePublished: data,
+	author,
+});
 ---
 
 <style lang="scss">
@@ -35,18 +47,18 @@ const lang = post.data.lang;
 	}
 </style>
 
-<Layout title={title} description={description} lang={lang}>
+<Layout title={title} description={description} lang={lang} schema={schema}>
 	<article>
 		<section>
-			<h1>{post.data.title}</h1>
+			<h1>{title}</h1>
 		</section>
 
 		<section>
 			<p>
 				<small>
 					Posted
-					<time datetime={post.data.pubDate.toISOString()} lang="en">{date}</time>
-					by&nbsp;{post.data.author}
+					<time datetime={data} lang="en">{formattedData}</time>
+					by&nbsp;{author}
 					<span>&nbsp;•&nbsp;</span>
 					<span>{remarkPluginFrontmatter.minutesRead}</span>
 				</small>
-- 
cgit v1.2.3